<%@page language="java" contentType="text/html; charset=UTF-8" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="html" tagdir="/WEB-INF/tags" %>
<!DOCTYPE html>
<html>
<html:header title="零售收银-结算">
    <link rel="stylesheet" href="${baseUrl}css/public.css" media="all">

    <style>
        .selected-dom{
            border:1px solid #0a60ff;
        }

        .layui-input{
            height: 56px;line-height: 56px;text-align: right;color: #333;font-size: 30px;font-weight: bold;font-family: Impact;    color: #333;
            padding-right: 30px;
        }
        .layui-input[name='realAmt']:focus{border-color:#0a60ff!important}

    </style>

    <script>
        jQuery(function () {

            $(window).focus();
            $('[name="realAmt"]').focus();

            window.addEventListener("keydown", function(e) {
                if (e.keyCode == 0x1B){
                    closeAllDialog();
                } else if (e.keyCode == 0x0D){
                    enter();
                } else if (e.keyCode == 113 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey)) {//ctrl+f7
                    ctrlF2();
                } else if (e.keyCode == 114 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey)) {//ctrl+f7
                    ctrlF3();
                } else if (e.keyCode == 39){
                    right();
                }  else if (e.keyCode == 37){
                    left();
                }
            }, false);

            $(".esc").click(function () {
                closeAllDialog();
            });

            $(".enter").click(function () {
                enter();
            });

            $('[name="realAmt"]').bind("input propertychange",function(event){
                let amount = $(this).val();
                amount = getNumber(parseFloat(amount));
                if (amount < 0) {
                    tips("不能为负数",this);
                    amount = -amount;
                }
                $(this).val(amount);

                processAmount();
            });

            processAmount();
        });

        function right() {
            ctrlF3();
        }

        function left() {
            ctrlF2();
        }

        function ctrlF2() {
            $('[name="realAmt"]').focus();
            $('[flag="1"]').next().find("div").click();

            $('[name="realAmt"]').val('');
            processAmount();
        }

        function ctrlF3() {
            $('[name="realAmt"]').focus();
            $('[flag="2"]').next().find("div").click();

            $('[name="realAmt"]').val(getPrice(totalAmt));
            processAmount();
        }

        function enter() {
            // closeAllDialog();
            // window.parent.closeAllDialog();
            let realAmt = $('[name="realAmt"]').val();
            realAmt = realAmt=="" ? 0:parseFloat(realAmt);
            if (realAmt < totalAmt) {
                errTip("实收金额不能小于应收金额");
                return;
            }

            let data = getFormJson($("form"));
            window.parent.settOrder(data.settAccountId);
            closeAllDialog();

        }

        function closeAllDialog() {
            window.parent.closeAllDialog();
        }

        let totalAmt=undefined;
        function setAmount(amount) {
            totalAmt = amount;
            processAmount();
        }

        function processAmount() {
            if (totalAmt == undefined) {
                return;
            }

            $('[name="totalAmt"]').val(getPrice(totalAmt));

            let realAmt = $('[name="realAmt"]').val();
            if (realAmt==""){
                $('[name="change"]').val(getPrice(0));
            } else {
                $('[name="change"]').val(getPrice(parseFloat(realAmt)-totalAmt));
            }
        }
    </script>
</html:header>
<body style="margin:0;background-color: #FFFFFF;height: 380px;width: 660px;padding: 30px 60px 0px 60px;">
    <div id="goods-name" style="font-size: 24px;width: 100%; text-align: left;margin-bottom: 20px;"></div>
    <form class="layui-form layui-form-pane" lay-filter="form">
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="radio" name="settAccountId" flag="1" value="${retailSetVo.cashSettAccountId}" title="现金(Ctrl+F2)" checked>
                <c:if test="${not empty retailSetVo.cardSettAccountId}">
                    <input type="radio" name="settAccountId" flag="2" value="${retailSetVo.cardSettAccountId}" title="银行卡(Ctrl+F2)" >
                </c:if>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="height: 56px;line-height: 34px;font-size: 18px;color: #666;">应收</label>
            <div class="layui-input-block">
                <input type="number" name="totalAmt" autocomplete="off" readonly class="layui-input readonly" style="">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="height: 56px;line-height: 34px;font-size: 18px;color: #666;">实收</label>
            <div class="layui-input-block">
                <input type="number" name="realAmt" autocomplete="off" class="layui-input">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label" style="height: 56px;line-height: 34px;font-size: 18px;color: #666;">找零</label>
            <div class="layui-input-block">
                <input type="number" name="change" autocomplete="off" readonly class="layui-input readonly">
            </div>
        </div>
    </form>

    <button class="layui-btn layui-btn-fluid layui-btn-normal enter" style="height: 74px;line-height: 72px;font-size: 24px;font-weight: bold;">确认结算(Enter)</button>


</body>

</html>